* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
.web{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    .drawBox{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        width: 636px;
        height: 636px;
        border: 1px solid pink;
        box-sizing: border-box;
        div{
            width: 200px;
            height: 200px;
            font-size: 28px;
            text-align: center;
            background-color: #ff0;
            color: #ccc;
            border: 2px solid rgb(0, 0, 0);
            user-select: none;
            margin-left: 6px;
            img{
                margin-top: 10px;
                width: 190px;
                height: 150px;
            }
            p{
                margin-top: -5px;
            }
            &:first-child{
                top: 0;
                left: 6px;
                order:1;
            }
            &:nth-child(2){
                top: 0;
                left: 211px;
                order:2;
            }
            &:nth-child(3){
                top: 0;
                left: 416px;
                order:3;
            }
            &:nth-child(4){
                top: 205px;
                left: 416px;
                order:6;
            }
            &:nth-child(5){
                top: 410px;
                left: 416px;
                order:9;
            }
            &:nth-child(6){
                top: 410px;
                left: 211px;
                order:8;
            }
            &:nth-child(7){
                top: 410px;
                left: 6px;
                order:7;
            }
            &:nth-child(8){
                top: 205px;
                left: 6px;
                order:4;
            }
            &:nth-child(9){
                top: 205px;
                left: 211px;
                line-height: 200px;
                order:5;

            }
            &.active{
                color: #ff0;
                background-color: red;
                transform: scale(.95);
                border-radius: 25%;
                img{
                    border-radius: 25%;
                    transform: scale(.95);
                }
            }
            &.starBtn{
                background-color: #ccc;
                color: #fff;
                border-radius: 50%;
                cursor: pointer;
            }
        }
    }

    .get {
        left: 200px;
        top: 200px;
        width: 200px;
        height: 200px;
        font-size: 28px;
        text-align: center;
        background-color: rgb(0, 225, 255);
        color: rgb(0, 140, 255);
        border: 2px solid rgb(0, 0, 0);
        position: absolute;
        user-select: none;
        img{
            margin-top: 10px;
            width: 190px;
            height: 150px;
        }
        p{
            margin-top: -5px;
        }
    }
}